<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>
</head>
<body>
    <button>按钮</button>
    <script>
    // 函数的不同调用方式决定了 this 的指向不同

    // 1.普通函数 this 指向 window
    function fn() {
        console.log('普通函数的 this' + this);
    }
    window.fn();
    // 2. 对象的方法 this 指向的是对象 O
    var o = {
        sayHi: function() {
            console.log('对象方法的 this:' + this);
        }
    }
    o.sayHi();
    // 3. 构造函数 this 指向 ldh 这个实例对象 原型对象里面的 this 指向的也是 ldh 这个实例对象
    function Star() {};
    Star.prototype.sing = function() {

    };
    var ldh = new Star();
    // 4. 绑定事件函数 this 指向的是函数的调用者 button 这个按钮对象
    var btn = document.querySelector('button');
    btn.onclick = function() {
        console.log('绑定事件函数的 this:' + this);
    }; 
    // 5. 定时器函数 的 this 指向的也是 window
    window.setTimeout(function() {
        console.log('定时器的this：' + this);
    }, 1000);
    // 6. 立即执行函数 this 还是指向 window
    (function() {
        console.log('立即执行函数的 this：' + this);
    })();    // 立即执行函数是自动调用
    </script>
</body>
</html>